<template>
  <div class="dialog">
    <el-dialog
      :title="'故障信息' + titleText"
      :visible.sync="showDialog"
      width="55%"
      top="0"
      :close-on-click-modal="false"
      @close="cancel"
    >
      <el-form
        ref="ruleForm"
        v-loading="loadFilesing"
        label-position="left"
        :model="formData"
        :rules="rules"
        class="el-form"
      >
        <el-form-item label="故障类型选择：" class="w50p" prop="hitchTypeCode">
          <el-select
            v-model="formData.hitchTypeCode"
            clearable
            filterable
            placeholder="故障类型选择"
          >
            <el-option
              v-for="item of hitchTypeArr"
              :key="item.hitchTypeCode"
              :label="item.hitchTypeName"
              :value="item.hitchTypeCode"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="故障源：" class="w50p" prop="discoverNodes">
          <el-select
            v-model="formData.discoverNodes"
            clearable
            filterable
            placeholder="故障源选择"
          >
            <el-option
              v-for="item of discoverNodesArr"
              :key="item"
              :label="item"
              :value="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="nowChanceStau === 'add'" label="选择设备类型：" class="w50p" prop="equipmentTypeCode">
          <el-cascader
            v-model="formData.equipmentTypeCode"
            :props="defaultProps"
            :options="equipmentTypeList"
            :show-all-levels="false"
            clearable
            placeholder="请选择所属设备类型"
            @change="changeEquipmentTypeCode"
          />
        </el-form-item>
        <el-form-item label="选择设备：" class="w50p" prop="equipmentCode">
          <el-select
            v-model="formData.equipmentCode"
            clearable
            filterable
            :disabled="nowChanceStau !== 'add'"
            placeholder="选择设备"
          >
            <el-option
              v-for="item in equipmentArr"
              :key="item.equipmentCode"
              :label="item.equipmentName"
              :value="item.equipmentCode"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="选择关键字：" class="w50p" prop="hitchDescription">
          <el-select
            v-model="formData.hitchDescription"
            clearable
            filterable
            multiple
            placeholder="选择关键字"
          >
            <el-option
              v-for="item in keysArr"
              :key="item.keywordCode"
              :label="item.hitchKeywordName"
              :value="item.hitchKeywordName"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="上报人：" class="w50p" prop="proposer">
          <el-select
            v-model="formData.proposer"
            clearable
            filterable
            placeholder="上报人选择"
          >
            <el-option
              v-for="item of userList"
              :key="item.userId"
              :label="item.username"
              :value="item.username"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="故障照片：" class="w50p">
          <!-- <el-upload
            ref="upload"
            class="upload-file"
            action
            multiple
            :on-remove="params => handleRemove(params)"
            :http-request="params => handleFile(params)"
            :file-list="uploadFileList"
            accept=".png, .jpg, .jpeg, .pdf"
          >
            <el-button type="text" class="add-many">
              <i class="el-icon-plus"></i>
            </el-button>
          </el-upload> -->
                    <UploadPics ref="UploadPics" accept=".jpg, .jpeg, .png" v-model="uploadPictureList" @input="handlerAddFileList($event, 'png')" @delectFileId="handlerDeleteId($event, 'png')">
            </UploadPics>
        </el-form-item>
        <el-form-item label="故障视频：" class="w50p">
          <!-- <el-upload
            ref="upload"
            class="upload-file"
            action
            multiple
            :on-remove="params => handleRemoveVideo(params)"
            :http-request="params => handleFileVideo(params)"
            :file-list="uploadVideoList"
            accept=".mp4"
          >
            <el-button type="text" class="add-many">
              <i class="el-icon-plus"></i>
            </el-button>
          </el-upload> -->
                    <UploadPics ref="UploadPics" accept=".mp4" v-model="uploadVideoList" @input="handlerAddFileList($event, 'video')" @delectFileId="handlerDeleteId($event, 'video')">
            </UploadPics>
        </el-form-item>
        <el-form-item label="上报日期 ：" class="w50p" prop="applyDate">
          <el-date-picker
            v-model="formData.applyDate"
            type="datetime"
            placeholder="选择日期"
            value-format="yyyy-MM-dd HH:mm:ss"
            format="yyyy-MM-dd HH:mm:ss"
            clearable
          />
        </el-form-item>
        <el-form-item label="维修方式 ：" class="w50p" prop="repairNature">
          <el-select
            v-model="formData.repairNature"
            clearable
            filterable
            placeholder="维修方式选择"
            @change="changeRepairWay"
          >
            <el-option
              v-for="item in repairNatureArr"
              :key="item.id"
              :label="item.name"
              :value="item.name"
            />
          </el-select>
        </el-form-item>
        <el-form-item
          v-if="formData.repairNature === '委外维修'"
          label="维修金额 ："
          class="w50p"
          prop="amount"
        >
          <el-input v-model="formData.amount" placeholder="请输入维修金额" clearable></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button class="cancelbtn" @click="cancel()">取 消</el-button>
        <el-button type="primary" class="savebtn" @click="save('ruleForm')">保 存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
// import MultipleUpMany from "@/components/uploadimage/MultipleUploadMany.vue";
import failureToReportApi from "@/api/equip-repair-manage/failure-to-report/index";
import equipTypeApi from "@/api/equip-manage/equip-type/index";
import equipScrapRecordApi from "@/api/equip-manage/equip-scrap-record";
import faultKeyManageApi from "@/api/equip-repair-support/fault-key-manage/index";
import userApi from "@/api/system-settings/user-manage";
import videoApi from "@/api/document";
import UploadPics from "@/components/UploadPics/upload-img-list.vue"
// import { log } from "console";
export default {
  name: "aaaa",
  components: {
    //  MultipleUpMany
    UploadPics
  },
  props: {
    // 弹框名称
    titleText: {
      type: String,
      default: "",
    },
    nowChanceStau: {
      type: String,
      default: "",
    },
    show: {
      type: Boolean,
      default: false,
    },
    editObject: {
      type: [Object],
      default: () => {
        return {};
      },
    },
    hitchTypeArr: {
      type: [Array],
      default: () => {
        return [];
      },
    },
    userList: {
      type: [Array],
      default: () => {
        return [];
      },
    },
  },
  data() {
    const ruleAmount = (rule, value, callback) => {
      if (!value) {
        callback(new Error("金额不能为空"));
      } else {
        if (!this.isNumber(value)) {
          callback(new Error("请输入数字值"));
        } else {
          callback();
        }
      }
    };
    return {
      uploadPictureList: [],
      uploadVideoList: [],
      videoUrlObj: {},
      formData: {},
      rules: {
        hitchTypeCode: [
          {
            required: true,
            message: "请选择故障类型",
            trigger: ["change", "blur"],
          },
        ],
        equipmentCode: [
          {
            required: true,
            message: "请选择设备",
            trigger: ["change", "blur"],
          },
        ],
        discoverNodes: [
          {
            required: true,
            message: "请选择故障节点",
            trigger: ["change", "blur"],
          },
        ],
        proposer: [
          {
            required: true,
            message: "请选择上报人",
            trigger: ["change", "blur"],
          },
        ],
        applyDate: [
          {
            required: true,
            message: "请选择上报日期",
            trigger: ["change", "blur"],
          },
        ],
        repairNature: [
          {
            required: true,
            message: "请选择维修方式",
            trigger: ["change", "blur"],
          },
        ],
        amount: [
          {
            required: true,
            message: "请输入维修金额",
            trigger: ["change", "blur"],
          },
          {
            validator: ruleAmount,
            trigger: "blur",
          },
        ],
      },
      // 故障节点
      discoverNodesArr: ["点检发现", "保养发现"],
      repairNatureArr: [
        { id: "NATURE_IN", name: "委内维修" },
        { id: "NATURE_OUT", name: "委外维修" },
      ],
      showDialog: this.show,
      delUploadVideoList: [],
      equipmentVideoIdList: [],
      uploadFileList: [],
      loadFilesing: false,
      // 设备类型数组
      equipmentTypeList: [],
      defaultProps: {
        children: "childList",
        value: "equipmentTypeCode",
        label: "equipmentTypeName",
        emitPath: false,
        checkStrictly: true,
      },
      equipmentArr: [],
      allkeysArr: [],
      keysArr: [],
      testList: [],
    };
  },

  watch: {
    show(v) {
      this.showDialog = v;
    },
    async nowChanceStau(v) {
      this.uploadVideoList = [];
      this.uploadPictureList = [];
      this.equipmentVideoIdList = [];
      this.delUploadVideoList = [];
      if (v === "add") {
        this.queryAllEnable();
        this.formData = {};
        // this.formData.repairNature = '委内维修'
        this.$set(this.formData, "repairNature", "委内维修");
        // this.formData.equipmentCode = '1232182228'

      this.$nextTick(() => {
        this.$refs['ruleForm']?.clearValidate();
      });
      }
      if (v === "edit") {
        this.queryNotDiscardAndDisable();
        this.formData = this.editObject;
        this.queryPicByCode(this.editObject.hitchInfoCode);
        if (this.editObject.hitchDescription) {
          this.formData.hitchDescription =
            this.editObject.hitchDescription.split(",");
        } else {
          this.formData.hitchDescription = [];
        }
        if (this.editObject.hitchInfoCode !== undefined) {
          const res = await failureToReportApi.queryBindVideos(
            this.editObject.hitchInfoCode
          );
          if (res.code === 1) {
            res.data.forEach((item) => {
              this.uploadVideoList.push({
                equipmentVideoId: item.equipmentVideoId,
                name: item.videoName,
                url: item.filePath
              });
            });

        this.equipmentVideoIdList = this.uploadVideoList.map(item => item.equipmentVideoId)
            console.log(this.uploadVideoList);
          }
        }
      }
    },
  },
  created() {
    this.queryPageKeyList();
    this.queryAllEnable();
    this.queryEquipmentType();
    // 进入修改获取视频信息
  },
  async mounted() {},
  methods: {
        // 添加-轮播图/视频
      handlerAddFileList(data, type){
      // console.log(data);
      if (type === 'png') {
        this.uploadPictureList = data.list;
      }
      if (type === 'video') {
        this.uploadVideoList = data.list;
        // this.videoUrlObj = data.obj;
        this.handleSuccessV(data.obj);
      }
      // if(this.form.fileList == null){
        // this.form.fileList = []
      // }
      // this.form.fileList.push(data.fileId)
    },
     // 视频上传
     handleSuccessV(obj) {
      let that = this;
      // let fd = new FormData();
      // fd.append("file", this.modePicture);
      // fd.append("equipmentCode", this.editObject.equipmentCode);
      videoApi.addEquipmentVideoNew({
        equipmentCode: this.editObject.hitchInfoCode,
        filePath: obj.url,
        fileName: obj.fileName
      }).then((res) => {
        if (res.code === 1) {
          this.equipmentVideoIdList.push(res.data.equipmentVideoId);
        }
        else that.$message.error(res.msg);
      });
    },
    handleSuccessVS(List, code) {
          failureToReportApi.videoBindHitch({
            hitchInfoCode: code,
            equipmentVideoIdList: List,
          });
    },
    // 图片上传
    handleSuccess(list, data) {
      let that = this;
      // let fd = new FormData();
      // fd.append("urlList", list.map(item => item.url));
      // list.forEach(item => fd.append("urlList", item.url));
      // fd.append("hitchInfoCode", this.editObject.hitchInfoCode);
      failureToReportApi.addPictureNew({
        hitchInfoCode: data ||  this.editObject.hitchInfoCode,
        urlList: list.map(item => item.url)
      }).then((res) => {
        if (res.code === 1) {
         //  that.$message.success("上传成功！");
         this.queryPicByCode(this.editObject.hitchInfoCode);
        }
        else that.$message.error(res.msg);
      });
    },
    // 删除-轮播图/视频
    handlerDeleteId(file, type){
      // this.$confirm()
      this.$confirm(`确认删除该${type === 'png' ? '图片' :type === 'video'? '视频': '文件' }`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "myClass",
      })
        .then(() => {
          // console.log(file)
          if (file.hitchPictureId) {
            var form = new FormData();
              form.append("hitchPictureCodeList", file.hitchPictureCode);
            failureToReportApi.delByHitchPictureCode(form).then((res) => {
            if (res.code === 1) this.$message.success("删除成功！");
            else this.$message.error(res.msg);
          });
            let fileId = file.url;
            this.uploadPictureList.splice(this.uploadPictureList.findIndex(i => i.url == fileId), 1)
          } else if (file.equipmentVideoId) {
            videoApi.delVideoList(file.equipmentVideoId).then((res) => {
            if (res.code === 1) this.$message.success("删除成功！");
            else this.$message.error(res.msg);
          });
          let fileId = file.url;
          this.uploadVideoList.splice(this.uploadVideoList.findIndex(i => i.url == fileId), 1)
        } else {
            if (type === "video") {
              let fileId = file.url;
              this.uploadVideoList.splice(
                this.uploadVideoList.findIndex(i => i.url == fileId),
                1
              );
            } else if (type === "png") {
              let fileId = file.url;
              this.uploadPictureList.splice(
                this.uploadPictureList.findIndex(i => i.url == fileId),
                1
              );
            } else  {

            let fileId = file.url;
            this.docuemntList.splice(
              this.docuemntList.findIndex(i => i.url == fileId),
              1
            );
            }
            }

        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    changeRepairWay(val) {
      console.log(val);
      this.formData.repairNature = val;
      console.log(this.formData.repairNature);
    },
    isNumber(val) {
      let regPos = /^\d+(\.\d+)?$/;
      let regNeg =
        /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/;
      if (regPos.test(val) || regNeg.test(val)) {
        return true;
      } else {
        return false;
      }
    },
    queryPageKeyList() {
      // 获取数据
      let param = {
        page: 1,
        size: 1000,
      };
      faultKeyManageApi.queryPageList(param).then((res) => {
        if (res.code === 1) {
          let data = res.data || {};
          this.allkeysArr = data.content || [];
          this.keysArr = data.content || [];
        }
      });
    },
    // 关联设备类型，根据父级查询子级
    queryEquipmentType() {
      // 获取数据
      equipTypeApi.queryTree({}).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.equipmentTypeList = this.filterTreeKey(data, 'childList');
        } else {
          this.$message.error(res.msg);
        }
      });
    },

    // 循环过滤树形数组
    filterTreeKey(arr, child) {
      let newArr = []
      newArr = arr?.map(item => {
        if (item[child]&&item[child].length > 0) {
          item = {
            ...item,
          [child]: this.filterTreeKey(
              item[child], child
            )
          }
        } else {
          delete item[child]
        }
        return item
      })
      newArr = newArr?.filter(item => item != null)
      return newArr
    },
    changeEquipmentTypeCode() {
      if (this.formData.equipmentTypeCode) {
        if (this.nowChanceStau === "add") {
          this.queryAllEnable();
        }
        this.queryKey();
        if (this.nowChanceStau === "edit") {
          this.queryNotDiscardAndDisable();
        }
      } else {
        this.keysArr = this.allkeysArr;
      }
    },
    // 查询所有启用的设备
    queryAllEnable() {
      this.equipmentArr = [];
      let params = {
        equipmentTypeCode:
          this.formData && this.formData.equipmentTypeCode
            ? this.formData.equipmentTypeCode
            : "",
      };
      equipScrapRecordApi.queryAllEnable(params).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.equipmentArr = data;
          // for (var i in data) {
          //   this.equipmentArr.push({
          //     equipmentName: data[i],
          //     equipmentCode: i
          //   })
          // }
        }
      });
    },
    // 查询所有不是报废以及禁用的设备
    queryNotDiscardAndDisable() {
      this.equipmentArr = [];
      let params = {
        equipmentTypeCode:
          this.formData && this.formData.equipmentTypeCode
            ? this.formData.equipmentTypeCode
            : void 0,
        equipmentName: void 0,
      };
      equipScrapRecordApi.queryNotDiscardAndDisable(params).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.equipmentArr = data;
          // for (var i in data) {
          //   this.equipmentArr.push({
          //     equipmentName: data[i],
          //     equipmentCode: i
          //   })
          // }
        }
      });
    },
    // 条件查询关键字
    queryKey() {
      this.keysArr = [];
      faultKeyManageApi.query(this.formData.equipmentTypeCode).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.keysArr = data;
        }
      });
    },
    // 查询可选择维修人
    queryUserList() {
      userApi.queryUserAll({}).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.userList = data;
        }
      });
    },
    queryPicByCode(data) {
      // // 获取数据
      // var form = new FormData()
      // form.append('hitchInfoCode', data)
      failureToReportApi.queryByHitchInfoId(data).then((res) => {
        if (res.code === 1) {
          let data = res.data || [];
          this.uploadPictureList = data;
          // this.uploadPictureList.forEach((a) => {
          //   a.name = a.pictureName;
          // });
          // console.log(this.uploadFileList);
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    // 删除视频
    async handleRemoveVideo(file) {
      if (this.nowChanceStau === "edit") {
        //修改
        const index = this.uploadVideoList.findIndex((item) => {
          return item.uid === file.uid;
        });
        this.delUploadVideoList.push(file);
        this.uploadVideoList.splice(index, 1);
        console.log("del删除");
      } else {
        // 添加
        const res = await videoApi.delVideoList(file.equipmentVideoId);
        if (res.code === 1) {
          const index = this.uploadVideoList.findIndex((item) => {
            return item.equipmentVideoId === file.equipmentVideoId;
          });
          const index1 = this.equipmentVideoIdList.findIndex((item) => {
            return item === file.equipmentVideoId;
          });
          this.uploadVideoList.splice(index, 1);
          this.equipmentVideoIdList.splice(index1, 1);
          console.log(this.uploadVideoList);
          console.log(this.equipmentVideoIdList);
        }
      }
    },
    // 添加视频
    async handleFileVideo(file) {
      // 修改
      if (this.nowChanceStau === "edit") {
        this.uploadVideoList.push(file.file);
        console.log("添加");
        console.log(this.uploadVideoList);
      } else {
        // 添加
        let form = new FormData();
        form.append("file", file.file);
        form.append("videoName", file.file.name);
        const res = await videoApi.addEquipmentVideo(form);
        if (res.code === 1) {
          this.equipmentVideoIdList.push(res.data.equipmentVideoId);
          file.file.equipmentVideoId = res.data.equipmentVideoId;
          this.uploadVideoList.push(file.file);
          console.log(this.uploadVideoList);
        } else {
          this.$message.error("文件格式不正确");
        }
      }
    },
    // 视频绑定 先获取添加时返回的
    async bindVideo(data) {
      if (this.equipmentVideoIdList.length > 0) {
        let hitchApplyAuditVideoBindBO = {
          equipmentVideoIdList: this.equipmentVideoIdList,
          hitchInfoCode: data,
        };
        const res = await failureToReportApi.videoBindHitch(
          hitchApplyAuditVideoBindBO
        );
        console.log(res);
        this.equipmentVideoIdList = [];
        this.uploadVideoList = [];
        this.delUploadVideoList = [];
      }
    },
    // 图片删除
    handleRemove(file) {
      if (file.hitchPictureCode) {
        let index = this.uploadFileList.findIndex((a) => a.uid === file.uid);
        var form = new FormData();
        form.append("hitchPictureCodeList", file.hitchPictureCode);
        failureToReportApi.delByHitchPictureCode(form).then((res) => {
          if (res.code === 1) {
            this.uploadFileList.splice(index, 1);
          }
        });
      } else {
        let index1 = this.uploadFileList.findIndex(
          (a) => a.uid === file.file.uid
        );
        if (index1 !== -1) {
          this.uploadFileList.splice(index1, 1);
        }
      }
    },
    // 上传图片
    handleFile(file) {
      this.loadFilesing = true;
      this.uploadFileList.push(file.file);
      this.loadFilesing = false;
      // }
    },
    save(formData) {
      const picList = this.uploadPictureList;
      console.log(picList, 'picList')
      this.$refs[formData].validate((valid) => {
        if (valid) {
          this.formData.hitchInfoBO = {
            hitchTypeCode: this.formData.hitchTypeCode,
            hitchDescription: this.formData.hitchDescription?.toString(),
            equipmentCode: this.formData.equipmentCode,
            discoverNodes: this.formData.discoverNodes,
            organizationMark: sessionStorage.organizationNo,
            proposer: this.formData.proposer,
            hitchInfoCode: this.editObject.hitchInfoCode,
              farmingTypeNo: sessionStorage.farmingTypeNo,
              farming: sessionStorage.farming
          };
          var index = this.equipmentArr.findIndex(
            (item) => item.equipmentCode === this.formData.equipmentCode
          );
          if (index !== -1) {
            this.$set(
              this.formData.hitchInfoBO,
              "equipmentName",
              this.equipmentArr[index]["equipmentName"]
            );
          }
          if (this.nowChanceStau === "edit") {
            failureToReportApi.edit(this.formData).then(async (res) => {
              if (res.code === 1) {
                //添加并绑定视频
                await this.handleSuccessVS(this.equipmentVideoIdList, this.formData.hitchInfoCode);
                this.$message.success("修改成功！");
                this.$emit("updataHit");
                if (picList.length > 0) {
                  this.handleSuccess(picList.filter(item => !item.hitchPictureId), this.formData.hitchInfoCode);
                } else {
                  this.close();
                }
              } else {
                this.$message.error(res.msg);
              }
            });
          } else if (this.nowChanceStau === "add") {
            failureToReportApi.add({...this.formData,
              farmingTypeNo: sessionStorage.farmingTypeNo,
              farming: sessionStorage.farming}).then(async (res) => {
              if (res.code === 1) {
                let data = res.data || "";
                // 绑定视频
                console.log(data);
                console.log(this.equipmentVideoIdList);
                await this.handleSuccessVS(this.equipmentVideoIdList, data);
                this.$message.success(res.msg);
                this.$emit("updataHit");
                if (picList.length > 0) {
                  this.handleSuccess(picList, data);
                } else {
                  this.close();
                }
              } else {
                this.$message.error(res.msg);
              }
            });
          }
        } else {
          return false;
        }
      });
    },
    async submitVideo1(hitchInfoCode) {
      console.log(this.uploadVideoList, "A1");
      let List1 = [];
      const videoLength = this.uploadVideoList.length;
      // 添加
      this.uploadVideoList.forEach(async (item) => {
        if (item.equipmentVideoId !== undefined) {
          List1.push(item.equipmentVideoId);
          console.log("原ID");
        } else {
          console.log("新ID");
          const eqVideoID = await this.getVideoID(item);
          if (eqVideoID) {
            List1.push(eqVideoID);
            console.log(List1);
            if (List1.length === videoLength) {
              let hitVideoBindBO = {
                equipmentVideoIdList: List1,
                hitchInfoCode: hitchInfoCode,
              };
              console.log(hitVideoBindBO);
              failureToReportApi.videoBindHitch(hitVideoBindBO).then((res) => {
                if (res.code === 1) {
                  console.log(res.msg);
                }
              });
            }
          }
        }
      });
      // 删除
      this.delUploadVideoList.forEach(async (item) => {
        if (item.equipmentVideoId) {
          // 在这里执行删除
          console.log(item);
          await videoApi.delVideoList(item.equipmentVideoId);
          console.log("在这里执行删除");
        }
      });
    },
    // 获取ID2
    async getVideoID(file) {
      let form = new FormData();
      form.append("file", file);
      form.append("videoName", file.name);
      const res = await videoApi.addEquipmentVideo(form);
      if (res.code === 1) {
        return res.data.equipmentVideoId;
      } else {
        return null;
      }
    },
    // 编辑保存时触发
    // async submitVideo(hitchInfoCode) {
    //   // let that = this
    //   this.uploadVideoList.forEach(async (item, index) => {
    //     console.log(index);
    //     if (item.equipmentVideoId !== undefined) {
    //       console.log(index);
    //       this.equipmentVideoIdList.push(item.equipmentVideoId);
    //       console.log(this.equipmentVideoIdList, "111");
    //     } else if (item.equipmentVideoId === undefined) {
    //       console.log(index);
    //       let list = [...this.equipmentVideoIdList];
    //       const listLength = this.uploadVideoList.length;
    //       await this.addVideoRequest(
    //         item,
    //         listLength - 1,
    //         index,
    //         list,
    //         hitchInfoCode
    //       );
    //       console.log("在这里执行绑定");
    //     }
    //   });
    //   this.delUploadVideoList.forEach(async item => {
    //     if (item.equipmentVideoId) {
    //       // 在这里执行删除
    //       console.log(item);
    //       await videoApi.delVideoList(item.equipmentVideoId);
    //       console.log("在这里执行删除");
    //     }
    //   });
    // },
    // 添加视频请求返回ID
    // async addVideoRequest(file, i, x, list, hitchInfoCode) {
    //   let form = new FormData();
    //   form.append("file", file);
    //   form.append("videoName", file.name);
    //   let res = await videoApi.addEquipmentVideo(form);
    //   this.testList.push(res.data.equipmentVideoId);
    //   if (i === x) {
    //     let List = list.concat(this.testList);
    //     const hitchApplyAuditVideoBindBO = {
    //       equipmentVideoIdList: List,
    //       hitchInfoCode: hitchInfoCode
    //     };
    //     await failureToReportApi.videoBindHitch(hitchApplyAuditVideoBindBO);
    //     this.testList = [];
    //   }
    //   if (res.code === 1) {
    //     return res.data.equipmentVideoId;
    //   } else {
    //     return null;
    //   }
    // },
    upPicture(picList, data) {
      var hasEdit = false;
      var form = new FormData();
      picList.forEach((a) => {
        if (!a.hitchPictureCode) {
          form.append("files", a);
          hasEdit = true;
        }
      });
      form.append("hitchInfoCode", data);
      if (hasEdit) {
        failureToReportApi.addPicture(form).then((res) => {
          if (res.code === 1) {
            this.$message.success(res.msg);
            this.close();
          } else {
            this.$message.error(res.msg);
          }
        });
      } else {
        this.close();
      }
    },
    close() {
      this.$emit("closeDialog");
      this.$nextTick(() => {
        this.$refs['ruleForm']?.clearValidate();
      });
    },
    // 离开清空视频
    clearVideoList() {
      this.uploadVideoList.forEach((item) => {
        this.handleRemoveVideo(item);
      });
    },
    cancel() {
      if (this.nowChanceStau === "edit") {
        this.uploadVideoList = [];
        this.delUploadVideoList = [];
      }
      this.$emit("cancelDialog");
      this.$nextTick(() => {
        this.$refs['ruleForm']?.clearValidate();
      });
      this.clearVideoList();
      this.uploadVideoList = [];
    },
  },
};
</script>

<style lang="scss" scoped>
.add-many {
  border: 1px solid #6ecae3;
  width: 40px;
  height: 40px;
  padding: 0;
  background-color: transparent;
  line-height: 40px;
  border-radius: 4px;
  color: rgb(161, 154, 154);
  font-weight: 600;
  i {
    font-size: 40px;
  }
}
</style>
